<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:insert="~{include :: header('索取列表')}" />
    <th:block th:insert="~{include :: bootstrap-table-css}" />
</head>
<body class="hold-transition">
<div class="container-fluid mt-2 mb-2">
    <div class="card card-primary card-outline card-outline-tabs mb-0">
        <div class="card-body">
            <form id="formId" class="form-inline">
                <input class="form-control mr-1" placeholder="手机/学校名称" type="text" name="searchKey"/>
                <select class="form-control mr-1" name="status">
                    <option value="">状态</option>
                    <option value="0">未读</option>
                    <option value="1">已读</option>
                </select>
                <a class="btn btn-primary btn-rounded mr-1" onclick="$.table.search()"><i class="fa fa-search"></i>&nbsp;搜索</a>
                <a class="btn btn-warning btn-rounded" onclick="$.form.reset()"><i class="fa fa-refresh"></i>&nbsp;重置</a>
            </form>
        </div>
    </div>
    <div class="select-table table-striped">
        <table id="bootstrap-table" class="table-striped"></table>
    </div>
</div>
<th:block th:insert="~{include :: footer}" />
<th:block th:insert="~{include :: bootstrap-table-js}" />
<script th:inline="javascript">
    var prefix = "/book/require";
    $(function() {
        var options = {
            showSearch: false,
            showRefresh: false,
            showToggle: false,
            showColumns: false,
            url: prefix + "/list.json",
            modalName: "样书列表",
            columns: [
                {
                    field: 'id',
                    title: 'id'
                },
                {
                    field: 'schoolName',
                    title: '学校名称'
                },
                {
                    field: 'position',
                    title: '校内职务'
                },
                {
                    field: 'contacts',
                    title: '联系人'
                },
                {
                    field: 'mobile',
                    title: '电话'
                },
                {
                    field: 'status',
                    align: 'center',
                    title: '状态',
                    formatter: function (value, row, index) {
                        return value > 0 ? '<span class="badge badge-primary">已读</span>' : '<span class="badge badge-danger">未读</span>';
                    }
                },
                {
                    field: 'createTime',
                    title: '时间',
                },
                {
                    title: '操作',
                    align: 'center',
                    width: 150,
                    formatter: function (value, row, index) {
                        var actions = [];
                        actions.push('<a class="btn btn-info btn-xs" href="javascript:void(0)" onclick="requireView(\'' + row.id + '\')"><i class="fa fa-search"></i>详情</a> ');
                        return actions.join('');
                    }
                }]
        };
        $.table.init(options);
    });

    //编辑院校
    function requireView(id) {
        var index = layer.open({
            title: '详情',
            content: prefix + '/view.html?id='+id,
            type: 2,
            shade: 0.2,
            maxmin: false,
            shadeClose: true,
            area: ['70%', '90%']
        });
    }
</script>
</body>
</html>